<template>
  <div class="shareKnow">
    <div class="share-top">
      <h3 class="title">信息地图</h3>
    </div>
    <div class="Content">
      <el-card class="leftTree" style>
        <el-tree
          highlight-current
          v-loading="treeLoading"
          :data="treeData"
          node-key="logId"
          :default-expanded-keys="expandedKey"
          :props="defaultProps"
          @node-click="handleNodeClick"
        >
          <span class="custom-tree-node" slot-scope="{ node }">
            <span :class="node.level<= 3 ? 'files' : 'file' ">{{ node.label}}</span>
            <!-- <span
              :class=" (node.label == '经营通报' || node.label == '专题分析') ? 'file' : 'files' "
            >{{ node.label }}</span>-->
          </span>
        </el-tree>
      </el-card>
      <!-- <router-view style="width: 100%; margin-left: 260px; box-shadow: none; border-width: 0;"/> -->

      <el-card class="rightTable">
        <!-- <div slot="header" class="rightHeader">
          <h3 class="area">
            {{logName}}
          </h3>
        </div>-->
        <div class="time-wrap">
          <div class="area">{{logName}}</div>
          <div class="left-w">
            所属时间
            <el-select v-model="fileYear" class="fileYear">
              <el-option
                v-for="item in yearOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
            <el-select v-model="fileMonth" class="fileYear">
              <el-option
                v-for="item in monthOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
            <!-- <el-date-picker
            v-model="fileTime"
            format="yyyy-MM"
            type="month"
            value-format="yyyy-MM"
            placeholder="选择月"
            :picker-options="endDateDisabled" 
            ></el-date-picker>-->
            <el-button
              type="primary"
              style="background: #7f92f7;border-color: #7f92f7; padding: 8px 15px;margin-left: 15px;"
              @click="goSearch"
              size="small"
            >查询</el-button>
          </div>
          <div class="right-w">
            <el-button
              type="primary"
              style="background: #7f92f7;border-color: #7f92f7; padding: 8px 15px"
              size="small"
              @click="nextPath('/budget/knowledgSharing/uploadShare')"
            >上传分享</el-button>
            <el-button
              type="success"
              style="background: #7ed093;border-color: #7ed093; padding: 8px 15px"
              size="small"
              @click="uploadAll"
            >上传汇总</el-button>
          </div>
        </div>
        <el-table
          v-loading="tableLoading"
          :data="tableData"
          :header-cell-style="{background:'#d7e5fb',color:'#464C69', padding: '6px 0', 'font-size': '12px', 'text-align': 'center'}"
          :cell-style="cellStyle"
          style="width: 100%"
          class="tableTh28"
          border
          stripe
          ref="table"
          max-height="500"
        >
          <el-table-column
            v-for="item in tableTitle"
            :show-overflow-tooltip="item.id == 'title' ? true : false"
            :key="item.id"
            :label="item.label"
            :prop="item.id"
            :min-width="item.width"
          ></el-table-column>
          <el-table-column label="操作" width="95" align="center">
            <template slot-scope="scope">
              <span
                style="color:#7f92f7;cursor: pointer; "
                @click="toDetail(scope.$index, scope.row)"
              >查看详情</span>
              <!-- <el-button
              size="mini"
              type="primary"
              @click="handleEdit(scope.$index, scope.row)"
              v-show="scope.row.isCurrentUser==1"
              >编辑</el-button>-->
              <!-- <el-button
              size="mini"
              type="primary"
              style="background: #FF6a07;border-color: #FF6a07"
              @click="toDetail(scope.$index, scope.row)"
              >查看</el-button>-->
              <!-- <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)"
              v-show="scope.row.isCurrentUser==1"
              >删除</el-button>-->
            </template>
          </el-table-column>
        </el-table>

        <!-- 翻页 -->
        <div class="page" v-if="dataTotal">
          <span class="jumper">
            <span class="go" @click="searchSize">跳至</span>
            <input
              v-model="currentPageInput"
              @keyup="vaildSize"
              class="num"
              min="1"
              type="number"
              autocomplete="off"
            />页
          </span>
          <!-- <span class="sizes" >
            <el-select @change="currentSel" v-model="pageSize" class="sizeinput">
              <el-option
                v-for="item in pagesOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </span>-->
          <el-pagination
            layout="prev, pager, next, sizes"
            :page-sizes="[10, 50, 100]"
            @size-change="sizeChange"
            :page-size="pageSize"
            :total="dataTotal"
            :current-page.sync="currentPage"
            @current-change="handleCurrentChange"
          ></el-pagination>
        </div>
      </el-card>
      <el-dialog :visible.sync="showUploadAll" append-to-body width="812px" class="showUploadAll">
        <div slot="title">上传汇总</div>
        <div class="contentTitle">
          <p>
            区域
            <dx-cascader
              style="width: 100px; font-size: 12px;line-height:30px;"
              :area_id.sync="areaId"
              ref="cascader"
              :maxLevel="3"
            />
          </p>
          <p>
            日期
            <el-date-picker
              style="width: 100px; margin-right:9px;"
              size="small"
              v-model="date"
              type="year"
              placeholder="选择年"
            ></el-date-picker>栏目
            <el-select v-model="typeId" style="width: 100px; margin-right: 15px;">
              <el-option label="专题分析" value="1"></el-option>
              <el-option label="经营通报" value="2"></el-option>
            </el-select>是否可见资料
            <el-select v-model="showFlag" style="width: 100px;margin-right: 15px;">
              <el-option label="可见资料" value="0"></el-option>
              <el-option label="全部资料" value="1"></el-option>
            </el-select>
          </p>
          <el-button type="primary" size="small" class="selfClass" @click="search">查询</el-button>
          <el-button type="primary" size="small" class="selfClass" @click="exportFile">导出</el-button>
        </div>
        <el-table
          :data="uploadListData"
          v-loading="searchLoading"
          style="width: 100%;margin-top: 10px;"
          border
          stripe
          height="430px"
          ref="table"
          :header-cell-style="{background:'#f3f4f7',color:'#727ba4', 'border-right-color': 'transparent', padding: '0', width: '40px', height: '40px', 'font-size': '12px', 'text-align': 'center'}"
          :cell-style="{padding: '0', 'border-right-color': 'transparent', width: '40px', height: '20px', color:'#636d9a', 'font-size': '12px', 'text-align': 'center'}"
        >
          <el-table-column
            v-for="item in upTableTitle"
            :width="item.id=='areaName'?'':50"
            :key="item.id"
            :label="item.label"
            :prop="item.id"
            :align="item.center"
          >
            <template slot-scope="scope">
              <div v-if="item.id!='areaName'">
                <div v-show="scope.row[item.id].value > 0">
                  <el-tooltip placement="right-start">
                    <div slot="content">
                      <p>上传时间: {{scope.row[item.id].time}}</p>
                    </div>
                    <span style="cursor: pointer;">{{scope.row[item.id].value}}</span>
                  </el-tooltip>
                </div>
                <!-- <p v-show="scope.row[item.id].value!='是'">{{scope.row[item.id].value}}</p> -->
              </div>
              <div v-else>{{scope.row[item.id]}}</div>
            </template>
          </el-table-column>
        </el-table>
        <!-- <span slot="footer" class="dialog-footer">
            <el-button @click="showUploadAll = false" size="mini">取 消</el-button>
            <el-button
              type="primary"
              class="selfClass"
              @click="showUploadAll = false"
              size="mini"
            >确 定</el-button>
        </span>-->
      </el-dialog>
    </div>
  </div>
</template>
<script>
import { $budgetAPI } from "@/api";
import { _formatYMD } from "@/utils/common";
import prefixAPI from "@/api/prefixAPI";
import { getCookie, setCookie } from "@/common/js/cookie";
export default {
  name: "knowledgSharing",
  data() {
    return {
      treeLoading: true,
      treeData: [],
      expandedKey: [], //默认展开的id集合
      defaultProps: {
        children: "childrenList",
        label: "logName",
      },
      upTableTitle: [
        { id: "areaName", label: "区域" },
        { id: "month1", label: "1月" },
        { id: "month2", label: "2月" },
        { id: "month3", label: "3月" },
        { id: "month4", label: "4月" },
        { id: "month5", label: "5月" },
        { id: "month6", label: "6月" },
        { id: "month7", label: "7月" },
        { id: "month8", label: "8月" },
        { id: "month9", label: "9月" },
        { id: "month10", label: "10月" },
        { id: "month11", label: "11月" },
        { id: "month12", label: "12月" },
      ],
      uploadListData: [],
      tableLoading: true,
      searchLoading: true,
      showUploadAll: false,
      tableData: [],
      fileId: null,
      logName: null,
      tableTitle: [
        { id: "typeName", label: "栏目", width: "120px" },
        { id: "title", label: "标题", width: "220px" },
        { id: "clickNum", label: "点击", width: "100px" },
        { id: "createUserName", label: "发布人", width: "105px" },
        { id: "areaName", label: "地区", width: "80px" },
        { id: "fileTime", label: "时间", width: "118px" },
        { id: "createTime", label: "上传日期", width: "170px" },
      ],
      areaId: null, //弹窗中区域选择的id记录
      fileTime: new Date(),
      // endDateDisabled: {
      //   disabledDate: time => {
      //     // return time.getTime() > Date.now() - 8.64e7;
      //     return time.getTime() > Date.now();
      //   }
      // },
      currentAreaName: "",
      isArea: "",
      fileYear: "",
      yearOptions: [
        {
          value: "",
          label: "全部",
        },
      ],
      fileMonth: "",
      monthOptions: [
        {
          value: "",
          label: "全部",
        },
        {
          value: "01",
          label: "1月",
        },
        {
          value: "02",
          label: "2月",
        },
        {
          value: "03",
          label: "3月",
        },
        {
          value: "04",
          label: "4月",
        },
        {
          value: "05",
          label: "5月",
        },
        {
          value: "06",
          label: "6月",
        },
        {
          value: "07",
          label: "7月",
        },
        {
          value: "08",
          label: "8月",
        },
        {
          value: "09",
          label: "9月",
        },
        {
          value: "10",
          label: "10月",
        },
        {
          value: "11",
          label: "11月",
        },
        {
          value: "12",
          label: "12月",
        },
      ],
      // pagesOptions: [
      //   {
      //     value: 10,
      //     label: "10条/页"
      //   },
      //   {
      //     value: 50,
      //     label: "50条/页"
      //   },
      //   {
      //     value: 100,
      //     label: "100条/页"
      //   }
      // ],
      currentPage: 1,
      currentPageInput: 1,
      pageSize: 10,
      dataTotal: 0,
      typeId: "",
      totalPage: "",
      showFlag: "0",
    };
  },
  computed: {
    logId() {
      return this.$store.state.main.logId;
    },
  },
  created() {
    this.getTree();

    this.date = new Date();
    const accountInfo = JSON.parse(sessionStorage.getItem("accountInfo"));
    this.areaId = accountInfo.areaId;
    this.getYears();
  },
  methods: {
    handleNodeClick(data) {
      this.fileId = null;
      // if (this.$route.path != "/budget/knowledgSharing/uploadShareSharingTable") {
      //   this.$router.push({
      //     path: "/budget/knowledgSharing/uploadShareSharingTable"
      //   });
      // }
      if (this.logId == data.logId) {
        return;
      }
      this.$store.dispatch("UPDATA_SHARINGLOGID", { logId: data.logId });
      this.getList();
    },
    async getTree() {
      $budgetAPI.budgetShare(
        {},
        (res) => {
          this.alertError(res);
          if (res.code == 0) {
            const that = this;
            this.treeData = res.content;
            this.treeData.forEach(function (item) {
              that.expandedKey.push(item.logId);
            });
            this.$store.dispatch("UPDATA_SHARINGLOGID", { logId: null });
          }
          this.treeLoading = false;
        },
        (err) => {
          this.treeLoading = false;
        }
      );
    },
    uploadAll() {
      this.search();
      this.showUploadAll = true;
    },
    handleEdit(index, row) {
      this.fileId = row.fileId;
      this.$router.push({
        path: "/budget/knowledgSharing/uploadShare",
        query: { seq: row.fileId },
      });
    },
    handleDelete(index, row) {
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          $budgetAPI.shareDeleteFiles(
            { fileId: row.fileId },
            (res) => {
              this.alertError(res);
              if (res.code == 0) {
                this.$message({
                  type: "success",
                  message: "删除成功",
                });
                this.getList();
              }
            },
            (err) => {}
          );
        })
        .catch(() => {});
    },
    nextPath(path) {
      this.$router.push({ name: "uploadShare" });
    },
    search() {
      const year = this.date.getFullYear();
      this.searchLoading = true;
      $budgetAPI.budgetShareUpload(
        {
          areaId: this.areaId,
          year: year,
          typeId: this.typeId,
          showFlag: this.showFlag,
        },
        (res) => {
          this.alertError(res);
          if (res.code == 0) {
            this.uploadListData = res.content;
          }
          this.searchLoading = false;
        },
        (err) => {
          this.searchLoading = false;
        }
      );
    },
    exportFile() {
      let areaId = this.areaId,
        year = this.date.getFullYear(),
        typeId = this.typeId,
        showFlag = this.showFlag;

      if (process.env.NODE_ENV == "development") {
        window.location.href =
          prefixAPI.loc +
          "/api/sharedFiles/exportFilesStatistics?areaId=" +
          areaId +
          "&year=" +
          year +
          "&typeId=" +
          typeId +
          "&showFlag=" +
          showFlag +
          "&token=" +
          getCookie("token");
      } else if (process.env.NODE_ENV == "production") {
        window.location.href =
          prefixAPI.hp +
          "/api/sharedFiles/exportFilesStatistics?areaId=" +
          areaId +
          "&year=" +
          year +
          "&typeId=" +
          typeId +
          "&showFlag=" +
          showFlag +
          "&token=" +
          getCookie("token");
      }
    },
    toDetail(index, row) {
      this.fileId = row.fileId;
      this.$router.push({
        path: "/budget/uploadShareDetail",
        query: { seq: row.fileId },
      });
      // /budget/knowledgSharing/detail  /budget/uploadShareDetail

      // this.$router.push({
      //   name: "uploadShareDetail",
      //   params: { seq: row.fileId },
      // });
    },
    async getList() {
      let that = this;

      that.tableLoading = true;
      that.currentPage = +that.currentPage;
      $budgetAPI.budgetShareList(
        {
          logId: this.logId,
          fileYear: that.fileYear,
          fileMonth: that.fileMonth,
          currentPage: +that.currentPage,
          pageSize: that.pageSize,
        },
        (res) => {
          this.alertError(res);
          if (res.code == 0) {
            this.logName = res.content.currentAreaName;
            this.isArea = res.content.isArea;
            res.content.data.items.map((it) => {
              it.fileTime = it.fileYear + "/" + it.fileMonth;
              it.createTime = _formatYMD(it.createTime);
            });
            console.log(res.content.data);
            this.tableData = res.content.data.items;
            this.dataTotal = res.content.data.totalNum;
            this.currentPage = res.content.data.currentPage;
            this.totalPage = res.content.data.totalPage;
          }
          this.tableLoading = false;
        },
        (err) => {
          this.tableLoading = false;
        }
      );
    },
    goSearch() {
      this.getList();
    },
    getYears() {
      let that = this,
        year = new Date().getFullYear() + "";
      // m = new Date().getMonth() + 1,
      // mm = m < 10 ? '0' + m : m;

      $budgetAPI.shareForyears({}, (res) => {
        console.log(res);
        res.content.map((it, i) => {
          that.yearOptions.push({ value: "" + it, label: it + "年" });
        });
        that.fileYear = year;
        that.fileMonth = "";
        that.getList();
      });
    },
    cellStyle({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 2) {
        // 指定列号
        return "padding: 8px 0;color:#ff0000;font-size: 12px;text-align: center";
      } else {
        return "padding: 8px 0;color:#21263E;font-size: 12px;text-align: center";
      }
    },
    //页码改变
    sizeChange(val) {
      this.pageSize = val;
      this.getList();
    },
    handleCurrentChange(page) {
      console.log();
      this.currentPage = +page;
      //将当前页传到保存的form表单
      // this.begin = page;
      this.getList();
    },
    searchSize() {
      if (+this.currentPageInput) {
        this.currentPage = +this.currentPageInput;
        this.getList();
      }
    },
    // currentSel(val) {
    //   this.sizeChange(val);
    // },
    vaildSize(e) {
      this.$nextTick(() => {
        if (!this.currentPageInput) {
          return;
        }
        if (!isNaN(this.currentPageInput)) {
          if (+this.currentPageInput < 1) {
            this.currentPageInput = 1;
          } else if (+this.currentPageInput > this.totalPage) {
            this.currentPageInput = this.totalPage;
          } else {
            this.currentPageInput = this.currentPageInput;
          }
        } else {
          this.currentPageInput = 1;
        }
      });
    },
  },
  // watch: {
  //   logId: {
  //     handler(newValue, oldValue) {
  //       this.getList();
  //     },
  //     deep: true
  //   }
  // }
};
</script>
<style scoped lang="scss">
$title-color: #6a82fd;
$bg-color: #f4f4f4;
$bg-wrap-color: #fff;
$boder-color: #eaeaea;
$font-color: #222;

.shareKnow {
  // min-height: 720px;
  // max-height: 600px;
  overflow: hidden;
  background-color: $bg-wrap-color;
  .share-top .title {
    color: $title-color;
    font-size: 16px;
    padding-top: 15px;
    padding-bottom: 10px;
    padding-left: 40px;
    border-bottom: 1px solid $boder-color;
    font-weight: 600;
    margin-bottom: 10px;
    background: url("~@/assets/images/common/map@2x.png") 16px 16px no-repeat;
    background-size: 16px;
    // margin-left: 16px;
  }
  .Content {
    display: flex;
    align-items: flex-start;
    position: relative;
    .leftTree {
      position: absolute;
      left: 10px;
      top: 0;
      width: 180px;
      height: 100%;
      overflow-y: auto;
      background-color: #f4f5f8;
      box-shadow: none;
      border-width: 0;
      border-radius: 0;
      z-index: 99;
      &::-webkit-scrollbar-thumb {
        background-color: #bbc2d6 !important;
      }
      /deep/ .el-card__body {
        padding: 0 !important;
        /deep/ .el-tree-node__expand-icon {
          color: #595959;
        }
        .el-tree-node__expand-icon.is-leaf {
          color: transparent;
        }
        /deep/ .el-tree-node__content {
          color: $font-color;
        }
        .el-tree--highlight-current
          .el-tree-node.is-current
          > .el-tree-node__content {
          background-color: #e8ecff;
          color: $title-color;
        }
      }
    }
    // .leftTree::-webkit-scrollbar-thumb {
    //         background-color: #bbc2d6 !important;
    // }
    /deep/ .el-dialog__wrapper {
      overflow: hidden;
    }
  }
  .el-tree-node {
    .files,
    .file {
      display: flex;
      align-items: center;
    }
    // .file {
    //    color: #555;
    // }
    .files:before {
      margin: 0 4px 0 3px;
      content: "";
      background-image: url("~@/assets/images/common/fileN.png");
      background-size: cover;
      display: block;
      width: 12px;
      height: 12px;
      z-index: 100;
    }
    .file:before {
      margin: 0 4px 0 3px;
      display: block;
      content: "";
      background-image: url("~@/assets/images/common/page.png");
      background-size: cover;
      width: 12px;
      height: 14px;
      z-index: 100;
    }
  }
}
.rightTable {
  width: 100%;
  box-shadow: none;
  padding-left: 220px;
  margin-right: 10px;
  border-width: 0;
  min-height: 480px;
  /deep/ .el-card__body {
    padding: 0;
  }
  /deep/ .el-card__header {
    padding: 0;
    border-bottom-width: 0;
  }
  .page {
    display: flex;
    align-items: center;
    flex-flow: row-reverse;
    .sizes {
      margin-left: 20px;
      margin-right: 16px;
      .sizeinput {
        /deep/ .el-input__inner {
          width: 100px;
          border-radius: 0;
          border: 1px solid #aaa;
          height: 30px;
          font-size: 12px;
          color: #aaa;
          border-radius: 3px;
        }
        /deep/ .el-input__icon {
          line-height: 30px;
        }
      }
    }

    .jumper {
      font-size: 13px;
      color: #aaa;
      height: 30px;
      line-height: 30px;
      .go {
        display: inline-block;
        cursor: pointer;
        color: #aaa;
        &:hover {
          color: #6a82fd;
        }
      }

      .num {
        max-width: 40px;
        padding: 0 10px;
        height: 30px;
        line-height: 30px;
        vertical-align: middle;
        border-radius: 3px;
        border: 1px solid #aaa;
        color: #aaa;
        margin: 0 10px;
        text-align: center;
      }
      input[type="number"] {
        -moz-appearance: textfield;
      }
      input[type="number"]::-webkit-inner-spin-button,
      input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
      }
    }
  }
  .page /deep/ .el-pagination .btn-next,
  .el-pagination .btn-prev {
    color: #aaa;
  }
  .page /deep/ .el-pagination {
    padding: 0;
  }
  .page /deep/ .el-pager li.active {
    background-color: #6a82fd;
    border-color: #6a82fd;
    color: #fff;
  }
  .page /deep/.el-pager li {
    min-width: 30px;
    height: 30px;
    border: 1px solid #aaa;
    color: #aaa;
    font-weight: 500;
    margin-right: 10px;
    border-radius: 5px;
    &:last-child {
      margin-right: 0;
    }
  }
  .page /deep/ .el-pagination .el-pagination__sizes .el-input__inner {
    border-color: #aaa;
    color: #aaa;
    height: 30px;
    line-height: 30px;
  }
  .rightHeader {
    // padding-top: 5px;
    color: #4e567b;
    > .area {
      display: flex;
      align-items: center;
      font-size: 14px;
      .color {
        color: #636d9a;
        padding-left: 5px;
      }
    }
    > .area:before {
      display: block;
      content: "";
      height: 100%;
      content: url("~@/assets/images/common/column.png");
      margin-right: 6px;
      margin-top: 5px;
      color: #666;
    }
  }
  /deep/
    > .el-card__body
    > .el-table>>.el-table__body-wrapper
    > table
    > tbody
    > tr {
    > td {
      color: #757b94;
      font-weight: 500;
    }
  }
  /deep/
    > .el-card__body
    > .el-table>>.el-table__header-wrapper
    > table
    > thead {
    color: #636d9a;
  }
}
.showUploadAll {
  /deep/ > .el-dialog > .el-dialog__body {
    padding: 8px 12px 10px;
  }
  /deep/ > .el-dialog > .el-dialog__header {
    background: #f3f4f7;
    padding: 0 20px;
    color: #636363;
    line-height: 35px;
    height: 35px;
    font-size: 14px;
  }
  /deep/ .el-dialog .el-dialog__header .el-dialog__headerbtn {
    top: 8px;
    right: 12px;
  }
  /deep/ .el-table--border th.gutter:last-of-type {
    border-bottom: 1px solid #f3f4f7;
  }

  .contentTitle {
    display: flex;
    align-items: center;
    height: 30px;
    > p {
      // margin-right: 14px;
      padding-left: 9px;
    }
    /deep/ .el-input__inner {
      border-radius: 0;
      border: 1px solid #ddd;
      height: 30px;
      font-size: 12px;
      color: #333;
    }
    /deep/ .el-input__icon {
      line-height: 30px;
    }
  }
}
.selfClass {
  background: #7f92f7;
  border: #252e64;
}
.el-dialog__footer {
  padding: 0;
  background-color: #f3f3f3;
  margin-top: 23px;
}
.time-wrap {
  margin: 10px 0 10px 0;
  font-size: 14px;
  display: flex;
  align-items: center;
  // justify-content: space-between;
  .area {
    // width: 190px;
    color: #666;
    height: 30px;
    line-height: 30px;
    padding-left: 20px;
    background: url("~@/assets/images/common/column.png") 0 50% no-repeat;
    background-size: 16px;
    margin-right: 20px;
    font-size: 14px;
  }
  .left-w {
    color: #666;
    font-size: 14px;
    display: flex;
    align-items: center;
    width: 320px;
  }
  .fileYear {
    width: 85px;
    height: 30px;
    margin-left: 10px;
    /deep/ .el-input__inner {
      border-radius: 0;
      border: 1px solid #ddd;
      height: 30px;
      font-size: 12px;
      color: #333;
    }
  }
  .right-w {
    text-align: right;
    flex: 1;
  }
  /deep/ .el-input__icon {
    line-height: 30px;
  }

  /deep/ .el-table th {
    padding: 6px 0;
  }
  .tableTh28 {
    /deep/ .el-table__header-wrapper .el-table th {
      padding: 6px 0;
    }

    /deep/ .el-table--border,
    /eddp/ .el-table--group {
      border: 1px solid #d6d8e4;
    }
    /deep/ .el-table__body .el-table__row {
      height: 40px;
    }
  }
}
/deep/ .el-table--striped .el-table__body tr.el-table__row--striped td {
  background-color: #f0f1f5;
}
/deep/ .el-table--border td {
  border-right: 1px solid #cdcfd9;
}
/deep/ .el-table td,
.el-table th.is-leaf {
  border-bottom: 1px solid #cdcfd9;
}
.textStyle {
  padding: 8px 0;
  color: #21263e;
  font-size: 12px;
  text-align: center;
}
</style>
